<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <title>Document</title>
    <style>
       .u-center{
            margin: 0;
            font-family: 微软雅黑, "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;
            background-color: #f9f9e9;
        }
      .u-center header{
          background-image: url("images/a1e66dc3jw8e12q2i0qj9j.jpg");
          background-size: cover;
          padding: 24px;
          text-align: center;
          color: #ffffff;
      }
       .u-center header img{
            display: block;
            width: 40px;
            height: 40px;
            border: 1px solid #fff;
            border-radius: 44px;
            margin:4px auto;
        }
        .u-center ul{
            margin: 0;
            list-style: none;
            padding:  0 4px;
        }
        .u-center li{
            line-height: 24px;
            font-size: 14px;
            padding:14px  8px;
            border-bottom: 1px solid #e9e9e9;
        }
        .u-center li img{
            width: 28px;
            height: 28px;
            vertical-align: middle;
            margin-right: 8px;
        }
    </style>
</head>
<body>
<article class="u-center">
    <header>
        <img src="images/pc.png" alt="头像"/>
        我的昵称
    </header>
    <section>
        <ul>
            <li ref="collect">
                <img src="images/pc.png" alt="我的收藏"/>
                我的收藏
            </li>
            <li rel="message">
                <img src="images/pc.png" alt="我的消息"/>
                我的消息
            </li>
            <li rel="news">
                <img src="images/pc.png" alt="新闻推送"/>
                新闻推送
            </li>
            <li rel="latest">
                <img src="images/pc.png" alt="最近阅读"/>
                最近阅读
            </li>
            <li ref="activity">
                <img src="images/pc.png" alt="最新活动"/>
                最新活动
            </li>
         
        </ul>
    </section>
</article>
</body>
</html>